<script setup lang="ts">
defineProps(["todos"]);
</script>

<template>
  <div class="son">
    <h1>作用域插槽</h1>
    <ul>
      <li v-for="todo in todos" :key="todo.id">
        <!-- 将数据回传给父组件 -->
        <slot :todo="todo">
          {{ todo.title }}
        </slot>
      </li>
    </ul>
  </div>
</template>

<style scoped>
.son {
  width: 50%;
  min-height: 200px;
  background: darkkhaki;
  padding: 1.5rem;
  margin: 0.5rem;
}
</style>
